{% extends 'back/index.html' %}

{% block content %}
    <div class="rt_content">
        <div class="page_title">
            <h2 class="fl">会员添加</h2>
        </div>
        <form action="/user_add/" class="form-horizontal" method="post" enctype="multipart/form-data">
            <div class="form-body">
                        <div class="form-group">
            <ul class="ulColumn2">
                <li>
                    <span class="item_name" style="width:120px;">上传头像：</span>
                    <label>
                        <input type="file" class="hide" name="Profile" onchange="xmTanUploadImg(this)">
                        <img src="/static/back/images/icon/pro.jpg" width="120" height="120" class="uploadImg"
                             id="avarimgs"/>
                    </label>
                </li>
                <li>
                    <span class="item_name" style="width:120px;">会员名称：</span>
                    <input type="text" class="textbox textbox_225" name="name" placeholder="会员账号..."/>

                </li>
                <li>
                    <span class="item_name" style="width:120px;">登陆密码：</span>
                    <input type="password" class="textbox textbox_225" name="admin" placeholder="会员密码..."/>
                </li>
                <li>
                    <span class="item_name" style="width:120px;">会员等级：</span>
                    <select class="select" name="grade">
                        <option value="普通会员">普通会员</option>
                        <option value="高级会员">高级会员</option>
                    </select>
                </li>
                <li>
                    <span class="item_name" style="width:120px;">电子邮箱：</span>
                    <input type="email" class="textbox textbox_225" name="e-mail" placeholder="电子邮件地址..."/>
                </li>
                <li>
                    <span class="item_name" style="width:120px;">手机号码：</span>
                    <input type="tel" class="textbox textbox_225" name="phone" placeholder="手机号码..."/>
                </li>
                <li>
                    <span class="item_name" style="width:120px;">用户权限：</span>
                    <select class="select" name="role">
                        <option>选择权限</option>
                        <option value=0>普通用户</option>
                        <option value=1>管理员</option>
                    </select>
                </li>
                {#            <li>#}
                {#                <span class="item_name" style="width:120px;">收货地址：</span>#}
                {#                <select class="select" id="prov"  name="prov" onchange="showCity(this)">#}
                {#                    <option>选择省份</option>#}
                {##}
                {#                </select>#}
                {#                <select class="select" id="city" name="city" onchange="showCountry(this)">#}
                {#                    <option>选择城市</option>#}
                {##}
                {#                </select>#}
                {#                <select class="select" id="country" name="country" onchange="selectCountry(this)">#}
                {#                    <option>选择区/县</option>#}
                {##}
                {#                </select>#}
                {#            </li>#}
                {#            <li>#}
                {#                <span class="item_name" style="width:120px;">详细地址：</span>#}
                {#                <input type="text" class="textbox textbox_295" name="concreteAddress" placeholder="详细地址..."/>#}
                {#            </li>#}
                <li>
                    <span class="item_name" style="width:120px;"></span>
                    <input type="submit" class="link_btn" value="更新/保存"/>
                </li>

            </ul>
                        </form>

    </div>
    <script src="/static/back/js/city.js"></script>
    <script src="/static/back/js/method01.js"></script>

    <script type="text/javascript">//上传头像实时变动浏览
    if (typeof FileReader == 'undefined') {
        document.getElementById("xmTanDiv").InnerHTML = "<h1>当前浏览器不支持FileReader接口</h1>";
        document.getElementById("xdaTanFileImg").setAttribute("disabled", "disabled");
    }

    //选择图片，马上预览
    function xmTanUploadImg(obj) {
        var file = obj.files[0];
        console.log(obj);
        console.log(file);
        console.log("file.size = " + file.size);
        var reader = new FileReader();
        reader.onloadstart = function (e) {
            console.log("开始读取....");
        }
        reader.onprogress = function (e) {
            console.log("正在读取中....");
        }
        reader.onabort = function (e) {
            console.log("中断读取....");
        }
        reader.onerror = function (e) {
            console.log("读取异常....");
        }
        reader.onload = function (e) {
            console.log("成功读取....");
            var img = document.getElementById("avarimgs");
            img.src = e.target.result;
            //或者 img.src = this.result;  //e.target == this
        }
        reader.readAsDataURL(file)
    }

    (function ($) {
            $(window).load(function () {
                if ( $('#drop3').toggle().is(':hidden') ) {
                    $('#drop3').collapse('show');
                }
                $('#3-2').addClass('active');
            });
        })(jQuery);
    </script>
{% endblock %}
